<template>
	<view style="padding: 30rpx;">
		<view style="margin-top: 20rpx;background-color: #fff;border-radius: 16rpx;padding: 20rpx;">
			<u-form :model="model" :rules="rules" ref="uForm" :errorType="errorType">
				<u-form-item :label-position="labelPosition" label="原密码" prop="oldPassword" label-width="150">
					<u-input :password-icon="true" :border="border" type="password" v-model="model.oldPassword"
						placeholder="请输入原密码"></u-input>
				</u-form-item>
				<u-form-item :label-position="labelPosition" label="新密码" prop="password" label-width="150">
					<u-input :password-icon="true" :border="border" type="password" v-model="model.password"
						placeholder="请输入新密码"></u-input>
				</u-form-item>
				<u-form-item :label-position="labelPosition" label="确认密码" label-width="150" prop="rePassword">
					<u-input :border="border" type="password" v-model="model.rePassword" placeholder="请确认密码"></u-input>
				</u-form-item>
			</u-form>
		</view>
		<view style="margin-top: 30rpx;"><u-button type="primary" @click="submit">修改密码</u-button></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				model: {
					oldPassword: '',
					password: '',
					rePassword: ''
				},
				rules: {
					oldPassword: [{
						required: true,
						message: '请输入原密码',
						trigger: ['change', 'blur'],
					}],
					password: [{
						required: true,
						message: '请输入密码',
						trigger: ['change', 'blur'],
					}],
					rePassword: [{
							required: true,
							message: '请重新输入密码',
							trigger: ['change', 'blur'],
						},
						{
							validator: (rule, value, callback) => {
								return value === this.model.password;
							},
							message: '两次输入的密码不相等',
							trigger: ['change', 'blur'],
						}
					],
				},
				labelPosition: 'left',
				errorType: ['toast'],
			}
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		methods: {
			submit() {
				this.$refs.uForm.validate(valid => {
					if (valid) {
						console.log('验证通过');
						this.$u.put("/mini/user/update/password", this.model).then(res => {
							if (res.success) {
								uni.reLaunch({
									url:"/pages/login/login"
								})
							} else {
								this.$u.toast(res.msg)
							}
						})
					} else {
						console.log('验证失败');
					}
				});
			},
		}
	}
</script>

<style>

</style>